<template>
	<div class="gk-layout-container">
		<div class="gk-layout-header">
			<!--工具栏-->
			<s-query perms="wh:pk" @click="findPage" add=true @addClick="handleAdd">

				<el-form-item>
					<el-input v-model.trim="filters.title" style="width:100px" placeholder="标题" />
				</el-form-item>
				<s-dict name="pkStatus" v-model="filters.status" />
			</s-query>
			<div class="toolbar" style="float:right;" v-if="false">
				<el-form :inline="true" :size="global.gSize">
					<el-form-item>
						<el-input v-model="pkFormData.boxCode" @keyup.enter.native="pkBoxCodes" placeholder="托盘码" />
					</el-form-item>
					<el-form-item>
						<el-input ref="barCode" v-model="pkFormData.barCode" @keyup.enter.native="pkBarCodes"
							placeholder="设备编码" />
					</el-form-item>
				</el-form>
			</div>
		</div>




		<div class="gk-layout-main">
			<my-table :data="pageResult.content" ref="zttableMain" :loading="loading">
				<el-table-column :label="$t('action.desc')" width="50" fixed="left" header-align="center" align="center">
					<template slot-scope="scope"> {{ scope.$index + 1 }} </template>
				</el-table-column>
				<column prop="title" label="标题" />
				<column prop="status" label="状态" key="status" :formatter="selectionFormat" />
				<column prop="createTime" label="创建时间" key="createTime" :formatter="dateFormatDay" />
				<el-table-column header-align="center" align="center" width='300' :label="$t('action.operation')">
					<template slot-scope="scope">
						<kt-button :label="$t('action.edit')" perms="wh:pk:edit"  v-if="scope.row.status >0" 	@click="handleShowDetail(scope.$index, scope.row)" />
						<kt-button label="选托盘" perms="wh:pk:start" v-if="scope.row.status == 1" @click="handleStock(scope.$index, scope.row)" />
						<kt-button label="打印"  perms="wh:pk:start" v-if=" scope.row.status == 2" @click="handlePreview(scope.row)" /> 
						<kt-button label="删除" perms="wh:pk:start" v-if="scope.row.status == 1" 	@click="deletePk(scope.$index, scope.row)" />
						<kt-button label="开始盘库" perms="wh:pk:start" v-if="scope.row.status == 1" @click="handleOut(scope.$index, scope.row)" />
						<kt-button label="终止任务" perms="wh:pk:start" v-if="scope.row.status ==2" @click="handleTerminate(scope.row)" />
					</template>
				</el-table-column>
			</my-table>
		</div>

		<div class="toolbar gk-layout-footer" style="padding:10px;">
			<el-pagination layout="total, prev, pager, next, jumper" @current-change="findPage"
				:current-page="filters.pageNum" :page-size="filters.pageSize" :total="pageResult.totalSize"
				style="float:right;">
			</el-pagination>
		</div>
		<pk-view :key="componentKey" ref="editItmeOut" :subDataForm="dataForm" :pkViewVisible="editDialogVisible"
			@receiptHidden="receiptHidden"></pk-view>
		<select-stock :coreStockDetailViewVisible="coreStockViewVisible" @coreStockClose="coreStockHidden"
			:myParam="this.coreStockDetailViewFilters">
		</select-stock>


	</div>
</template>

<script>

import SQuery from "@/components/Kj/SQuery"
import { format, formatDay } from "@/utils/datetime"
import { myPrint, addHtmlTd, addHtmlSpan, rowSpan } from "@/utils/LodopFuncs"
import MyTable from "@/views/Core/MyTable"
import Column from "@/views/Core/Column"
import KtButton from "@/views/Core/KtButton"
import SDict from "@/components/Kj/SDict"
import SReflash from "@/components/Kj/SReflash"
import SelectStock from "./SelectStock"
import { getItemName, dictsFormat } from "@/utils/myUtil"
import PkView from "./PkView"
export default {
	components: {
		KtButton,
		MyTable,
		Column,
		SQuery, SReflash,
		SelectStock,
		SDict,
		PkView
	},
	data() {
		return {
			componentKey: 1,
			filters: {
				label: '', pageNum: 1, pageSize: this.global.pageSize
			},
			loading: false,
			pkFormData: {},
			pageResult: {},
			operation: true,

			editDialogVisible: false, // 新增编辑界面是否显示
			editLoading: false,

			coreStockDetailViewTitle: '',
			coreStockViewVisible: false,
			coreStockDetailViewFilters: { pkId: null },
			// 新增编辑界面数据
			dataForm: {
				id: null,
				craneId: null,
				shelfId: null,
				itemId: null

			}
		}
	},
	methods: {
		// 获取分页数据
		findPage: function (data) {
			if (data != -1) {
				this.filters.pageNum = data
			}
			this.$api.pk.findPage(this.filters).then((res) => {
				this.pageResult = res.data
			})
		},
		receiptHidden: function () {
			this.editDialogVisible = false;
			this.findPage(-1);
		},
		coreStockHidden: function () {
			this.coreStockViewVisible = false
		},

		handleStock: function (params, r) {
			this.coreStockDetailViewFilters.pkId = r.id;
			this.coreStockDetailViewFilters.title = r.title + "--选托盘";
			this.coreStockViewVisible = true;
		},
		pkBoxCodes: function (data) {
			this.$refs['barCode'].focus();
		},
		handleTerminate: function (row) {

			this.$confirm("确定终止盘库单任务？", this.$t('action.tips'), {
				type: 'warning'
			}).then(() => {
				this.$api.pk.pkTerminate({ id: row.id }).then((res) => {
					this.$message({ message:res.data, type: 'success' })
					this.findPage(-1);
				})
			}).catch(() => {
			})



		},
		handlePreview: function (row) {
			this.$api.pk.printPk({ pkId: row.id }).then((res) => {
				var strList = res.data.info;
				var html = res.data.html;
				var detailHtml = "";

				for (let index = 0; index < strList.length; index++) {
					var detail = strList[index];
					detailHtml += "<tr>";

					let rowS = rowSpan(index, strList, "pCode");
					if (rowS > 0) {
						detailHtml += addHtmlSpan(detail.pCode, rowS);
					}
					detailHtml += addHtmlTd(getItemName(detail.itemId));
					detailHtml += addHtmlTd(detail.countDb);
					detailHtml += addHtmlTd(dictsFormat("units", detail.unit));
					detailHtml += "</tr>";
				}
				html = html.replace("{title}", row.title);
				html = html.replace("{Content}", detailHtml);
				myPrint("库房资产", html)

			})

		},
		pkBarCodes: function (data) {
			let barCode = this.pkFormData.barCode;
			if (barCode.length > 4) {
				this.$api.pk.checkDetail(this.pkFormData).then((res) => {
					if (res.code == 200) {
						this.$message({ message: this.$t('action.operateSucess'), type: 'success' })
						this.pkFormData.barCode = "";
						this.$refs['barCode'].focus()
					} else {
						this.$message({ message: this.$t('action.operateFail') + res.msg, type: 'error' })
					}
				})
			}
		},
		handleAdd: function () {
			this.editDialogVisible = true
			this.operation = true
			this.dataForm = { status: 1 }
			this.componentKey += 1;
		},
		// 显示详情界面
		handleShowDetail: function (params, row) {
			this.componentKey += 1;
			this.editDialogVisible = true
			this.operation = true
			this.dataForm = Object.assign({}, row);
		},
		deletePk: function (params, r) {
			this.$api.pk.pkDelete(r).then((res) => {

				if (res.code == 200) {
					this.$message({ message: res.data, type: 'success' })
					this.findPage(-1)   //这里有bug
				} else {
					this.$message({ message: res.msg, type: 'error' })
				}
			})
		},

		//出库生成任务
		handleOut: function (params, r) {
			this.$api.pk.enginePk(r).then((res) => {

				if (res.code == 200) {
					this.$message({ message: res.data, type: 'success' })
					this.findPage(-1)   //这里有bug
				} else {
					this.$message({ message: res.msg, type: 'error' })
				}
			})
		},
		format02null: function (row, column, cellValue, index) {
			if (cellValue == 0) {
				return "";
			}
			return cellValue;
		},
		// 时间格式化
		dateFormat: function (row, column, cellValue, index) {
			return format(row[column.property])
		},
		// 时间格式化
		dateFormatDay: function (row, column, cellValue, index) {
			return formatDay(row[column.property])
		},
		itemFilter: function (row, column, cellValue, index) {
			return getItemName(cellValue)
		},
		selectionFormat: function (row, column, cellValue, index) {
			let key = ""
			let propt = column.property;
			if (propt == "status") {
				key = "pkStatus"
			}
			return dictsFormat(key, cellValue)
		}
	},
	mounted() {
		this.findPage(1)
	}
}
</script>

